<template>
	<div class="setting-account-account">
		<h2>账号绑定</h2>
		<div class="ivu-mt ivu-pl ivu-pr">
			<Row type="flex" justify="center" align="middle">
				<Col span="22">
				<h4>
					<Avatar size="small" :src="info.headimgUrl ? info.headimgUrl : icon.wechat" />
					<span>微信</span>
				</h4>
				<p v-if="info.openId">当前已绑定微信账号</p>
				<p v-else>当前未绑定微信账号</p>
				</Col>
				<Col span="2" class="ivu-text-right">
				<i-link link-color></i-link>
				</Col>
			</Row>
			<Divider />
			<Row type="flex" justify="center" align="middle">
				<Col span="24">
				<h4>
					<Avatar size="small" :src="icon.sip" />
					<span>外呼账号</span>
				</h4>
				<p v-if="info.sipAccount">当前已绑定<span style="color: #2db7f5;">{{ info.number }}</span></p>
				<p v-else>当前未绑定外呼账号，请联系主管</p>
				</Col>
			</Row>
		</div>
	</div>
</template>
<script>
import { mapState } from 'vuex'
import iconWechat from '@/assets/svg/icon-social-wechat.svg';
import iconSip from '@/assets/images/phone.jpg';

export default {
	name: 'accountTwo',
	data() {
		return {
			icon: {
				wechat: iconWechat,
				sip: iconSip,
			},
		}
	},
	computed: {
		...mapState('admin/user', [
			'info'
		]),
	}
}
</script>
<style lang="less">
.setting-account-account {
	.ivu-col {
		h4 {
			span {
				margin-right: 8px;
			}
		}

		p {
			margin-top: 8px;
			color: #808695;
		}
	}
}
</style>
